import styled from 'styled-components';
const StyledDescription = styled.div`
  flex: ${({ percent, percents }) => {
    return percent / percents;
  }};
  display: inline-flex;
  border-top: 1px solid #404b5e;
  border-right: 1px solid #404b5e;
  box-sizing: border-box;
`;

const StyledLabel = styled.div`
  flex-shrink: 0;
  box-sizing: border-box;
  width: 200px;
  padding: 10px 16px;
  border-right: 1px solid #404b5e;
  background-color: #262e3c;
  color: #94a6be;
`;
const StyledValue = styled.div`
  flex: 1;
  padding: 10px 16px;
  background-color: #1e252f;
  color: #e7efff;
`;

export default StyledDescription;
export { StyledLabel, StyledValue };
